<template>
	<view style="padding: 5px">
		<uni-row>
			<uni-col>
				<uni-datetime-picker v-model="rq" type="date" :clear-icon="false" :end="Date.now()" @change="getAppDorHygieneCount"/>
			</uni-col>
		</uni-row>
		
		<uni-card v-for="(item,index) in countList" :key="index" :title="item.className" @click="to(item)">
			<view>
				<text>班级人数：{{item.classNum}}</text>
				<text style="float: right;">住宿人数：{{item.liveNum}}</text>
			</view>
			<view>
				<text>宿舍个数：{{item.dorNum}}</text>
				<text style="float: right;">未检查数：{{item.noCheckNum}}</text>
			</view>
			<view>
				<text>合格个数：{{item.goodDorNum}}</text>
				<text style="float: right;" :class="{'bad':item.badDorNum > 0 }">不合格数：{{item.badDorNum}}</text>
			</view>
		</uni-card>
	</view>
</template>

<script>
	import {
		parseTime
	} from "@/utils/date.js"
	
	export default {
		created() {
			this.getAppDorHygieneCount();
		},
		data() {
			return {
				rq: parseTime(Date.now()).slice(0, 10),
				countList: [],
			}
		},
		methods: {
			getAppDorHygieneCount(){
				uni.showLoading({
					mask: true,
					title: '加载中'
				});
				this.$api.dormitory.getAppDorHygieneCount(uni.getStorageSync("loginId"),this.rq).then( res => {
					console.log("宿舍卫生统计信息：",res.data);
					this.countList = [...res.data].sort((a, b) => b.badDorNum - a.badDorNum); 
					uni.hideLoading();
				})
			},
			to(item) {
				uni.navigateTo({
					url: `/pages_duty/classTeacher/dormitoryHygiene/HygieneToClass?classId=${item.classId}&className=${item.className}&rq=${this.rq}`
				})
			}
		}
	}
</script>


<style>
	.bad {
		color: red;
	}
</style>
